<html>

<head>

    <title>滑动测试-x,y,时间</title>

</head>

<body onselect="return false;" onselectstart="return false;" oncopy="return false;">

<div style="border:solid 1px red;position:absolute;left:400px;top:200px;width:354px;height:200px;">

    <div id="targetObj"
         style="border:solid 1px blud;background-color:red;width:44px;height:44px;position:absolute;left:10px;top:100px;"></div>

    <div id="srcObject"
         style="border:solid 1px blud;background-color:blue;width:44px;height:44px;position:absolute;left:50px;top:100px;"></div>

</div>

<script>

    (function () {

        var flag = false;

        var d = 0, x = 0, y = 0, d1, x1, y1, ys;

        var xe = document.body;

        var se = document.getElementById("srcObject");

        var te = document.getElementById("targetObj");


        te.style.left = Math.random() * 100 + 160;

        var line = [];

        xe.onmousedown = function (e) {

            d = new Date().getTime();

            x = e.screenX;

            y = e.screenY;

            ys = y;

            flag = true;

        }

        xe.onmouseup = function (e) {

            d1 = new Date().getTime();

            x1 = e.screenX;

            y1 = e.screenY;

            flag = false;

            var str = [x1 - x, y1 - y, y1 - ys, d1 - d];

            //var str = "["+(x1-x) + "," + (y1-y) + "," + (y1-ys)  + "," + (d1-d)+","+(te.offsetLeft-se.offsetLeft)+"]";

            line.push(str);

            //line += str;

            if (line.length > 20) {

                console.log(line.slice(0, 5).join(",") + line.slice(line.length / 2 - 5, line.length / 2 + 5).join(",") + line.slice(line.length - 5).join(","));

                //console.log(line.join(","));

            }

            //console.log(str);

            line = [];

            str = [];

            d = 0, x = 0, y = 0, d1 = 0, x1 = 0, y1 = 0;

            se.style.left = 50;

            te.style.left = Math.random() * 100 + 160;

        }

        xe.onmousemove = function (e) {

            if (flag) {


                d1 = new Date().getTime();

                x1 = e.screenX;

                y1 = e.screenY;

                se.style.left = se.offsetLeft + (x1 - x);

                var str = [x1 - x, y1 - y, y1 - ys, d1 - d];

                //var str = "["+(x1-x) + "," + (y1-y)  + "," + (y1-ys) + "," + (d1-d)+"]";

                //line += str;

                line.push(str);

                //console.log(str);

                //console.log(line);

                d = d1;

                x = x1;

                y = y1;

            }

        }

    })();


</script>

</body>

</html>